<template>
	<view>
		
		
		<view class="List" v-for="(item,index) in ListInfo" :key="index">
			<view class="flex "  @click="ToInfo(item.goods_id)">
				<view class="ImgBOx"><image :src="item.goods_image" mode=""></image></view>
				<view class="w550">
					<view class="Name">{{item.goods_name}}</view>
					
					<view class="CommInfo flexBox">
						<view class="">
							<view class="Price">原价：<text class="goodsPrice">{{item.goods_price}}</text></view>
							<view class="Price">当前价：<text class="red">￥{{item.now_price}}</text></view>
						</view>
						
						<view class="state">{{item.state_desc}}</view>
					</view>
				</view>
			</view>
			<view class="activityInfo">
				<view class="Title">活动标题：{{item.activity_name}}</view>
				<view class="Time">参与时间：{{item.addtime |formaDate}}</view>
			</view>
			<view class="flexBox" v-if="item.state_desc=='进行中'">
				<view class=""></view>
				<view class="flex BtnBox">
					<view class="cancel" @click="cancel(item.id)">取消</view>
					<view class="order" @click="order(item.goods_id,item.id)">下单</view>
				</view>
			</view>
		</view>
		
		<view v-if="ListInfo.length<=0">
			<image style="width: 100%;" :src="`${picUrl}/InfoNull.png`" mode="widthFix"></image>
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				ListInfo:[],
			}
		},
		created() {
			this.getList();
		},
		methods: {
			ToInfo(goods_id){
				uni.navigateTo({
					url:"/mall/goods/info?goods_id="+goods_id
				})
			},
			order(goods_id,id){//下单
				uni.navigateTo({
					url: '/mall/order/confirm?cart_id=' + goods_id +
						'|' + 1 + '&ifcart=0' + '&order_type=' + 3+"&bargain_visit_id="+id
				})
			},
			getList(){//获取列表信息
				let that=this;
				this.$util.request({
					url:'/mobile/index.php?act=member_bargain&op=bargain_list',
					method:'post',
					data:{}
				}).then(res=>{
					if(res.error_code==0){
						this.ListInfo=res.datas.bargain_list;
					}else{
						uni.showToast({
							title:res.message,
							icon:"none"
						})
					}
				})
			},
			cancel(id){//取消订单
				let that=this;
				this.$util.request({
					url:'/mobile/index.php?act=member_bargain&op=cancel_bargain',
					method:'post',
					data:{
						id:id,
					}
				}).then(res=>{
					if(res.error_code==0){
						uni.showToast({
							title:"取消成功",
							icon:"none"
						})
						that.getList()
					}else{
						uni.showToast({
							title:res.message,
							icon:"none"
						})
					}
				})
			}
			
		}
	}
</script>

<style>
	.goodsPrice{
		text-decoration: line-through;
		color: #999999;
	}
	.Title{
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		width: 680rpx;
	}
	.flex{
		display: flex;
	}
	.flexBox{
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.List{
		margin: 10rpx 0;
		padding: 20rpx;
		background-color: #FFFFFF;
	}
	.List .ImgBOx image{
		width: 136rpx;
		height: 136rpx;
		margin: 10rpx;
	}
	.w550{
		width: 550rpx;
	}
	.List .Name{
		font-size: 30rpx;
		height: 80rpx;
		overflow: hidden;
		display: -webkit-box;
		-webkit-box-orient:vertical;
		-webkit-line-clamp:2;
		font-weight: bold;
		color: #121212;
		line-height: 38rpx;
	}
	.List .CommInfo{
		margin-top: 15rpx;
	}
	.List .Price{
		font-size: 30rpx;
		font-weight: bold;
		color: #121212;
	}
	.red{
		color: red;
	}
	.activityInfo{
		color: #999999;
	}
	.List .BtnBox>view{
		width: 150rpx;
		height: 50rpx;
		line-height: 50rpx;
		text-align: center;
		background-color: #EEEEEE;
		color: #FFFFFF;
		margin-right: 40rpx;
		margin-top: 10rpx;
	}
	.List .BtnBox .order{
		background: linear-gradient(to right,#f61b6e,#ff4300);
	}
</style>
